<template>
    <div>
        <a-modal :title="title" :visible="visible" :confirm-loading="loading" @ok="handleOK" @cancel="handleCancel">
             <div style="width:250px;margin-bottom:20px;">
                 <a-input-search :placeholder="searchPlaceholder" enter-button v-model="keyword" @search="handleSearch(1)" />
            </div>
            <a-table 
            :row-selection="rowSelection"  
            :columns="columns" bordered 
            :pagination='pagination' 
            :data-source="dataList" 
            :type="type" 
            size='small' 
            @change="pageChange" 
            :key="freshKey"
            :rowKey="(record,index)=>{return index}">
            </a-table>
        </a-modal>
    </div>
</template>

<script>
import Vue from 'vue'
import { getAction, getActionAsync, postAction } from '@/api/manage'
import { ACCESS_TOKEN, USER_NAME } from '@/store/mutation-types'
export default {
  components: {},
  computed: {
    rowSelection() {
      return {
        type: 'radio',
        onChange: (selectedRowKeys, selectedRows) => {
            this.selectedRows = selectedRows;
        },
      };
    }
  },
  data() {
    return {
        freshKey: 0,
        keyword: '',
        pagination: {
            hideOnSinglePage: true,
            total: 0,
            current: 1
        },
        selectedRows: [],
        dataList: [],
        currPageIndex: 1,
        currPageSize: 10
    }
  },
  props:{
      visible: {
          Type: Boolean,
          default: false
      },
      loading: {
          Type: true,
          default: false
      },
      type: {
          Type: String,
          default: 'radio'
      },
      title: {
          Type: String,
          default: '请选择'
      },
      url: {
          Type: String,
          default: ''
      },
      columns: {
          Type: Array,
          default: []
      },
      searchPlaceholder: {
          Type: String,
          default: ''
      },
      params:{
            Type: Object,
            default: ()=>{return {}},
            require:false
      },
      keywordKey:{
          Type:String,
          default: 'keyword'
      },
      actionType:{
          Type:String,
          default: 'getAction'
      }

  },
  mounted() {
    this.rowSelection.type = this.type;
    this.handleSearch();
  },
  methods: {
      handleOK(){
          this.$emit('hatchHandleOk',this.selectedRows);
      },
      handleCancel(){
          this.$emit('hatchHandleOk',null);
      },
      handleSearch(pageNo){
        if(!!pageNo){
           this.currPageIndex = pageNo
        }
          this.freshKey++;
          var vm=this;
          var params = Object.assign(this.params,{keyword:this.keyword,pageNo: this.currPageIndex,pageSize: this.currPageSize})
          params[this.keywordKey] = this.keyword
          if(this.actionType == 'getAction'){
            getAction(this.url, params ).then(res=>{
                vm.dataList=[];
                vm.pagination.total=0;
                vm.pagination.current=this.currPageIndex;
                if(res.success){
                    var result=res.result;
                    vm.dataList=result.records;
                    vm.pagination.total=result.total;
                }else{
                    this.$message.warning(res.message)
                }
            }).catch(resp=>{
                this.$message.warning(resp.message)
            });
          }else{
            postAction(this.url, params ).then(res=>{
                vm.dataList=[];
                vm.pagination.total=0;
                vm.pagination.current=this.currPageIndex;
                if(res.success){
                    var result=res.result;
                    vm.dataList=result.records;
                    vm.pagination.total=result.total;
                }else{
                    this.$message.warning(res.message)
                }
            }).catch(resp=>{
                this.$message.warning(resp.message)
            });
          }          
      },
      pageChange(page){
          this.currPageIndex=page.current;
          this.currPageSize=page.pageSize;
          this.handleSearch();
      }
  }
}
</script>